<%-- 
    Document   : CrearCicloAcademico
    Created on : 05/09/2013, 08:01:37 AM
    Author     : CHRISTIAN
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Tutor</title>

        
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
        </script>
<script> 
$(document).ready(function(){
  $("#flip").click(function(){
    $("#panel").slideToggle("slow");
  });
});
</script>
 
<style type="text/css"> 
#panel,#flip
{
padding:5px;
text-align:center;
background-color:#e5eecc;
border:solid 1px #c3c3c3;
}
#panel
{

padding:30px;
display:none;
}
</style>

    </head>


    <body>
    <center>
        <div class="divIconos" style="width: 70%;border: 1px solid black;height: 65px">
            <button id="homeIcon" class="homeIcono"  >
                <a href="index.jsp">
                    <img src="images/Iconos/Home.jpg" height="30px" width="50px" />
                    <div>Principal</a></div>
                
          

            <button id="cancelarIcon" class="icono" onclick="cancelar()">
                <a href="#">
                    <img src="images/Iconos/Cancelar.png" height="30px" width="30px" />
                    <div>Cancelar</div></a>
            </button> 

            <button id="eliminarIcon" class="icono" onclick="">
                <a href="#">
                    <img src="images/Iconos/Borrar.png" height="30px" width="30px" />
                    <div>Eliminar</div></a>
            </button>   

            <button id="buscarIcon" class="icono" onclick="buscar()">
                <a href="#">
                    <img src="images/Iconos/Buscar.png" height="30px"  width="30" />  
                    <div> Buscar </div></a>
            </button>
            <button id="modificarIcon" class="icono" onclick="">
                <a href="#">
                    <img src="images/Iconos/Editar.png" height="30px" width="30px" />
                    <div>Modificar</div></a>
            </button>
            <button id="guardarIcon" class="icono" onclick="javascript:alert('Hola')">
                <a href="#">
                    <img src="images/Iconos/Guardar.png" height="30px" width="30px" />
                    <div>Guardar</div></a>
            </button>
            <button id="nuevoIcon" class="icono" onclick="">
                <a href="#">
                    <img src="images/Iconos/Nuevo.png" height="30px" width="30px" />
                    <div>Nuevo</div></a>
            </button>

        </div>


        <!-- ------------------------------------------------------------------------------- -->    

       
        

        <div style="width: 70%;border: 1px solid black">
            <div id="inicioTutor" style="border: 1px solid blue;background-image:url(images/TutorIconos/tutor.jpg);height:300px;background-size: 100% 300px">        
                
                            </div> </div>

        <div id="flip" onclick="deslizarFormula()">Registrar un Nuevo Tutor</div>
             <div id="panel">  
            <!--Formulario para registrar al tutor-->
            <div id="nuevoTutor" style="border: 1px solid red;height: 300px">
                <center>
                    <h3><font color="Blue">Registrar Nuevo Tutor</font> </h3>
                </center>
                <center>
                <form id="myform" method="POST">
                    <table>
                        <tr>
                            <td align="right"><label for="field">Nombre:</label></td>
                            <td align="left"><input type="text" class="left" id="nombre" name="nombre"></td>
                        </tr>

                        <tr>
                            <td align="right"> <label for="field"> Apellido Paterno</label> </td>
                            <td align="left"><input type="text" class="left" id="ApellPaterno" name="apellidoPater"></td>
                        </tr>
                        
                        <tr>
                            <td align="right"> <label for="field"> Apellido Materno</label> </td>
                            <td align="left"><input type="text" class="left" id="ApellMaterno" name="apellidoMater"></td>
                        </tr>
                        <tr>
                            <td align="right"><label for="field">DNI:</label></td>
                            <td align="left"><input type="text" class="left" id="dni" name="dni"></td>
                        </tr>
                        
                         <tr>
                             <td align="right"><label for="field">Telefono:</label></td>
                             <td align="left"><input  id="telefono" type=number class="left" name="telefono"/></td>
                        </tr>
                        
                        <tr>
                            <td align="right"><label for="field">Email:</label></td>
                            <td align="left"><input id="email" type="text" name="email" class="left"/></td>
                        </tr>
                        <tr>
                            <td align="right"><label for="field">Sueldo:</label></td>
                            <td align="left"> <input id="sueldo" type=number class="left" name="sueldo"/></td>

                        </tr> 
                       
                        
                        <div>  </div>
                    </table>
                    <input type="submit" value="Crear" onclick="crearSalon()">
                </form>
                </center>
            </div>
    </div>


    </center> 
</body>
</html>
